<!DOCTYPE html>
<html>
<head>
<title>项目管理工具</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link
	href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"
	rel="stylesheet">
<script src="https://code.jquery.com/jquery.js"></script>
<!-- 包括所有已编译的插件 -->
<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script>
	$(function() {
		$(".dropdown-toggle").dropdown();
	});
</script>
<style type="text/css">
.group {
	height: 400px;
	width: 800px;
}

.grouplist {
	float: left;
	height: 200px;
	width: 400px;
	font-size: 15px;
}

.grouplist:hover {
	background-color: #EEEED1;
}

.im {
	padding-top: 25px;
	float: left;
	height: 150px;
	width: 100px;
}

.imright {
	float: left;
	padding-top: 25px;
	padding-left: 20px;
	height: 200px;
	width: 300px;
	line-height: 2.0;
}
</style>
</head>
<body>

	<div class="container">
		<div class="row clearfix">
			<div class="col-md-12 column">
				<nav class="navbar navbar-default" role="navigation">
					<div class="navbar-header">
						<button type="button" class="navbar-toggle" data-toggle="collapse"
							data-target="#bs-example-navbar-collapse-1">
							<span class="sr-only">Toggle navigation</span><span
								class="icon-bar"></span><span class="icon-bar"></span><span
								class="icon-bar"></span>
						</button>

					</div>

					<div class="collapse navbar-collapse"
						id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav">

							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown">团队切换<strong class="caret"></strong></a>
								<ul class="dropdown-menu">

									<!-- <li class="divider"></li>
									<li><a>切换团队</a></li>
									<li class="divider">切换团队</li> -->
									<li><a href="#">团队1</a></li>
									<li><a href="#">团队2</a></li>
									<li><a href="#">团队3</a></li>
									<li><a href="#">团队4</a></li>
								</ul></li>
						</ul>

						<ul class="nav navbar-nav">

							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown">项目切换<strong class="caret"></strong></a>
								<ul class="dropdown-menu">

									<!-- <li class="divider"></li>
									<li><a>切换团队</a></li>
									<li class="divider">切换团队</li> -->
									<li><a href="#">项目1</a></li>
									<li><a href="#">项目2</a></li>
									<li><a href="#">项目3</a></li>
									<li><a href="#">项目4</a></li>
								</ul></li>
						</ul>
						<ul class="nav navbar-nav navbar-right">
							<li><a>欢迎您，张三</a></li>
							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown"><span
									class="glyphicon glyphicon-bell"></span>（4）<strong
									class="caret"></strong></a>
								<ul class="dropdown-menu">
									<li><a href="#">A申请</a></li>
									<li><a href="#">B申请</a></li>
									<li><a href="#">C申请</a></li>
									<li class="divider"></li>
									<li><a href="#">更多</a></li>
								</ul></li>
							<li><a href="#">注销</a></li>
						</ul>
					</div>

				</nav>
			</div>
		</div>



		<div class="row clearfix">
			<div class="col-md-3 column">
				<ul class="nav nav-stacked nav-tabs">
					<li class="active"><a href="">项目</a></li>
					</br>
					<li><a href="project1.html">任务</a></li>
					</br>

				</ul>
			</div>


			<div class="col-md-9 column">
				<div class="tabbable" id="tabs-458508">
					<ul class="nav nav-tabs">
						<li><a href="#panel-808913" data-toggle="tab">项目信息</a></li>
						<li class="active"><a href="#panel-876035" data-toggle="tab">项目成员</a></li>
					</ul>
					<div class="tab-content">
						<div class="tab-pane active" id="panel-876035">

							<div class="table-responsive">

								<h3>所有成员</h3>
								<h5>团队创建者：张三</h5>
								<div class="group">
									<div class="grouplist">
										<div class="im">
											<img src="style/image/t.jpg" height="150" width="100" />
										</div>
										<div class="imright">
											姓名：张三</br> 邮箱：18811112222@qq.com</br> 电话:18835469999</br> 团队评分：10
										</div>
									</div>
									<div class="grouplist">
										<div class="im">
											<img src="style/image/t.jpg" height="150" width="100" />
										</div>
										<div class="imright">
											姓名：张三</br> 邮箱：18811112222@qq.com</br> 电话:18835469999</br> 团队评分：10
										</div>
									</div>
									<div class="grouplist">
										<div class="im">
											<img src="style/image/t.jpg" height="150" width="100" />
										</div>
										<div class="imright">
											姓名：张三</br> 邮箱：18811112222@qq.com</br> 电话:18835469999</br> 团队评分：10
										</div>
									</div>
									<div class="grouplist">
										<div class="im">
											<img src="style/image/t.jpg" height="150" width="100" />
										</div>
										<div class="imright">
											姓名：张三</br> 邮箱：18811112222@qq.com</br> 电话:18835469999</br> 团队评分：10
										</div>
									</div>


								</div>


								<center>
									<ul class="pagination">
										<li><a href="#">Prev</a></li>
										<li><a href="#">1</a></li>
										<li><a href="#">2</a></li>
										<li><a href="#">3</a></li>
										<li><a href="#">4</a></li>
										<li><a href="#">5</a></li>
										<li><a href="#">Next</a></li>
									</ul>
								</center>

							</div>

						</div>
						<div class="tab-pane" id="panel-808913">
							<table class="table">
								<caption>基本的表格布局</caption>
								<thead>
									<tr>
										<th width="30%">项目名称</th>
										<th>项目1</th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<td>项目进度</td>
										<td>
											<div class="progress progress-striped active"
												style="width: 30%">
												<div class="progress-bar progress-success"
													style="width: 80%" role="progressbar" aria-valuenow="30"
													aria-valuemin="0" aria-valuemax="100">80%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>
											<div>
												<img alt="" src="findMissionsRelationship.do?projectId=1&roleId=1&userId=1">
											</div>
										</td>
									</tr>
								</tbody>
							</table>


						</div>
					</div>

				</div>
			</div>




		</div>
</body>
</html>
